import { Component, OnInit } from '@angular/core';
import { NzMessageService } from 'ng-zorro-antd/message';
import { Step } from '../../../../components/steps/steps.interfaces';
import { BtnAction } from '../../../../components/workflow/workflow.interfaces';

@Component({
  selector: 'app-workflow',
  templateUrl: './workflow.component.html',
  styleUrls: ['./workflow.component.scss']
})
export class WorkflowComponent implements OnInit {

  pageTitle = '创建XX';
  steps!: Step[];
  current = 1;
  startIndex = 1;
  stepChange(step: number) {
    this.current = step;
  }

  countLable = '数量';
  count = 1;

  billingDetailClick() {
    this.message.info('费用详情');
  }

  bottomBtns: BtnAction[] = [
    {
      text: '上一步',
      type: 'default',
      disabled: () => {
        return this.current <= this.startIndex ? true : false;
      },
      hidden: () => {
        return this.current <= this.startIndex ? true : false;
      },
      onClick: () => {
        this.current = this.current - 1;
        this.message.info('上一步');
      }
    },
    {
      text: '下一步',
      type: 'primary',
      disabled: () => {
        return this.current >= this.startIndex + this.steps.length - 1 ? true : false;
      },
      hidden: () => {
        return this.current >= this.startIndex + this.steps.length - 1 ? true : false;
      },
      onClick: () => {
        this.current = this.current + 1;
        this.message.info('下一步');
      }
    },
    {
      text: '确定',
      type: 'primary',
      onClick: () => {
        this.message.info('确定');
      }
    }
  ]
  constructor(
    private message: NzMessageService
  ) { }

  ngOnInit() {
    this.steps = [
      { title: '配置1' },
      { title: '配置2' },
      { title: '配置3', disabled: (current: number) => current < 2 },
      { title: '配置4', disabled: (current: number) => current < 3 },
    ];
  }

}
